var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "react-dom", "react", "maishu-dilu", "maishu-wuzhui-helper", "services/dataSources", "controls/wz-ext", "maishu-ui-toolkit"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    const ReactDOM = require("react-dom");
    const React = require("react");
    const maishu_dilu_1 = require("maishu-dilu");
    const maishu_wuzhui_helper_1 = require("maishu-wuzhui-helper");
    const dataSources_1 = require("services/dataSources");
    const wz_ext_1 = require("controls/wz-ext");
    const ui = require("maishu-ui-toolkit");
    function default_1(page) {
        ReactDOM.render(React.createElement(ReceivementAccountPage, null), page.element);
    }
    exports.default = default_1;
    class ReceivementAccountPage extends React.Component {
        constructor(props) {
            super(props);
            this.state = { item: this.emptyItem() };
        }
        emptyItem() {
            return { Name: "", Remark: "" };
        }
        componentDidMount() {
            maishu_wuzhui_helper_1.createGridView({
                dataSource: dataSources_1.dataSources.account,
                element: this.itemsTable,
                columns: [
                    maishu_wuzhui_helper_1.boundField({ dataField: 'Id', visible: false }),
                    maishu_wuzhui_helper_1.boundField({ dataField: 'Name', headerText: '名称', headerStyle: { width: '300px' } }),
                    maishu_wuzhui_helper_1.boundField({ dataField: 'Remark', headerText: '备注' }),
                    wz_ext_1.commandField({
                        leftButtons: (dataItem) => [
                            React.createElement("button", { key: "edit", className: "btn btn-minier btn-primary", onClick: () => {
                                    this.showUpdateDialog(dataItem);
                                } },
                                React.createElement("i", { className: "icon-pencil" }))
                        ],
                        headerStyle: { width: `100px` }
                    })
                ]
            });
            this.validator = new maishu_dilu_1.FormValidator(this.dialogElement, { name: 'name', rules: [maishu_dilu_1.rules.required('请输入收款账户名称')] });
        }
        showAddDialog() {
            // this.state.item = this.emptyItem();
            // this.setState(this.state);
            this.setState({ item: this.emptyItem() });
            ui.showDialog(this.dialogElement);
        }
        showUpdateDialog(item) {
            // this.state.item = item;
            // this.setState(this.state);
            this.setState({ item });
            ui.showDialog(this.dialogElement);
        }
        saveReceivementAccount() {
            return __awaiter(this, void 0, void 0, function* () {
                let { item } = this.state;
                let isValid = yield this.validator.check();
                if (!isValid) {
                    return Promise.reject('validate fail');
                }
                if (item.Id) {
                    return dataSources_1.dataSources.account.update(item);
                }
                return dataSources_1.dataSources.account.insert(item);
            });
        }
        render() {
            let { item } = this.state;
            return [
                React.createElement("ul", { key: "toolbar" },
                    React.createElement("li", { className: "pull-right" },
                        React.createElement("button", { className: "btn btn-sm btn-primary", onClick: () => this.showAddDialog() },
                            React.createElement("i", { className: "icon-plus" }),
                            React.createElement("span", null, "\u6DFB\u52A0")))),
                React.createElement("table", { key: "items", ref: (e) => this.itemsTable = e || this.itemsTable }),
                React.createElement("div", { key: "dialog", className: "modal", ref: (e) => this.dialogElement = e || this.dialogElement },
                    React.createElement("div", { className: "modal-dialog" },
                        React.createElement("div", { className: "modal-content" },
                            React.createElement("div", { className: "modal-header" },
                                React.createElement("button", { type: "button", className: "close", onClick: () => this.showAddDialog() },
                                    React.createElement("span", { "aria-hidden": "true" }, "\u00D7")),
                                React.createElement("h4", { className: "modal-title" }, item.Id ? '更新收款账户' : '添加收款账户')),
                            React.createElement("div", { className: "modal-body form-horizontal" },
                                React.createElement("div", { className: "form-group" },
                                    React.createElement("label", { className: "col-lg-2 control-label" }, "\u540D\u79F0*"),
                                    React.createElement("div", { className: "col-lg-10" },
                                        React.createElement("input", { name: "name", type: "text", className: "form-control", placeholder: "\u8BF7\u8F93\u5165\u8D26\u53F7\u540D\u79F0", value: item.Name, onChange: (e) => {
                                                item.Name = e.target.value;
                                                this.setState(this.state);
                                            } }))),
                                React.createElement("div", { className: "form-group" },
                                    React.createElement("label", { className: "col-lg-2 control-label" }, "\u5907\u6CE8"),
                                    React.createElement("div", { className: "col-lg-10" },
                                        React.createElement("input", { name: "remark", type: "text", className: "form-control", value: item.Remark, placeholder: "\u8BF7\u8F93\u5165\u8D26\u53F7\u5907\u6CE8", onChange: (e) => {
                                                item.Remark = e.target.value;
                                                this.setState(this.state);
                                            } })))),
                            React.createElement("div", { className: "modal-footer" },
                                React.createElement("button", { name: "cancel", type: "button", className: "btn btn-default", onClick: () => ui.hideDialog(this.dialogElement) }, "\u53D6\u6D88"),
                                React.createElement("button", { name: "ok", type: "button", className: "btn btn-primary", ref: (e) => {
                                        if (!e)
                                            return;
                                        ui.buttonOnClick(e, () => __awaiter(this, void 0, void 0, function* () {
                                            let result = yield this.saveReceivementAccount();
                                            ui.hideDialog(this.dialogElement);
                                            return result;
                                        }));
                                    } }, "\u786E\u5B9A")))))
            ];
        }
    }
});
